<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>二级库查询</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link th:href="@{/animate.min.css}" rel="stylesheet">
    <link rel="stylesheet" th:href="@{/layui/css/layui.css}" media="all">
    <script th:src="@{/common.js}"></script>


    <style>

        a, button {
            cursor: pointer;
        }


    </style>

</head>
<body style="background-color: #F8F8F8;">
<div>


    <!--    顶部导航-->
    <div class="layui-header" style="background-color: #23262E;">
        <ul class="layui-nav layui-layout-left" style="background-color: #23262E">
            <li class="layui-nav-item"><a onclick="window.location.href='/index?account='+ getQueryVariable('account')">主页</a>
            </li>
            <li class="layui-nav-item">
                <a href="javascript:;">一级库</a>
                <dl class="layui-nav-child">
                    <dd><a onclick="window.location.href='/addCenter?account='+ getQueryVariable('account')">入库
                    </a></dd>
                    <dd><a onclick="window.location.href='/queryCenter?account='+ getQueryVariable('account')">查询</a>
                    </dd>
                    <dd><a onclick="window.location.href='/outCenter?account='+ getQueryVariable('account')">出库申请</a>
                    </dd>
                </dl>
            </li>
            <li class="layui-nav-item layui-this">
                <a href="javascript:;">二级库</a>
                <dl class="layui-nav-child" id="nav">
                    <dd><a onclick="window.location.href='/queryAssist?account='+ getQueryVariable('account')">查询</a>
                    </dd>
                </dl>
            </li>
        </ul>
        <ul class="layui-nav layui-layout-right" style="background-color: #23262E">
            <li class="layui-nav-item">
                <a href="javascript:;">
                    <span><text th:text="${param.account}"></text></span>
                </a>
            </li>
            <li class="layui-nav-item"><a th:href="@{/userController/logout}">退出</a></li>
        </ul>
    </div>

    <div class="layui-layout layui-layout-admin">
        <div class="layui-body layui-card-body layui-card" style="background-color: #F8F8F8;position: absolute;left: 0;right: 0;top: 0;bottom:
         0;overflow-y:hidden">
            <div style="display: flex;padding: 20px;margin-top: 50px">
                <div style="width: 100%">

                    <div style="padding: 20px;text-align: center;margin-bottom: 10px">
                        <span style="font-size: 30px;" id="title"></span>
                    </div>

                    <div style="padding: 0 0 10px 10px;width: 40%">
                        <button onclick="window.location.href='/addAssist?kind='+getQueryVariable('kind')+ '&account='
                         + getQueryVariable('account')"
                                style="width: 15%;margin-left: 10px;font-size: 13px;border: none;background-color:
                        #000000;color: white;height: 30px"
                                type="button">申请入库
                        </button>
                        <button onclick="window.location.href='/rentAssist?kind='+getQueryVariable('kind')+ '&account='
                         + getQueryVariable('account')+'&aName='+getQueryVariable('aName')"
                                style="width: 15%;margin-left: 10px;font-size: 13px;border: none;background-color:
                        #000000;color: white;height: 30px"
                                type="button">借调申请
                        </button>
                    </div>

                    <div>
                        <table class="layui-table">
                            <colgroup>
                                <col width="250">
                                <col width="250">
                                <col width="200">
                                <col width="100">
                                <col width="100">
                                <col width="80">
                                <col width="170">
                                <col width="120">
                            </colgroup>
                            <thead>
                            <tr>
                                <th>流水号</th>
                                <th>品名</th>
                                <th>规格</th>
                                <th>使用人</th>
                                <th>单位</th>
                                <th>数量</th>
                                <th>入库时间</th>
                                <th>操作</th>
                            </tr>
                            </thead>
                            <tbody id="centerTab">

                            </tbody>
                        </table>
                    </div>

                </div>
            </div>
        </div>

    </div>

</div>


<script th:src="@{/layui/jquery-1.11.2.js}"></script>
<script th:src="@{/layui/layui.js}" charset="utf-8"></script>
<script>
    var laypage;
    $(function () {
        layui.use(['element', 'form', 'table', 'layer', 'laypage'], function () {
            var element = layui.element;
            var form = layui.form;
            var table = layui.table;
            var layer = layui.layer;
            laypage = layui.laypage;
            loadNav();
            loadAssist();

            let aName = decodeURI(getQueryVariable("aName"));
            $("#title").empty();
            $("#title").append("二级库-" + aName);

        });
    });


    function loadAssist() {
        let centerTab = $("#centerTab");
        centerTab.empty();
        $.ajax({
            url: '/storeController/loadAssist',
            data: {kind: getQueryVariable("kind")},
            async: false,
            type: 'get',
            contentType: 'application/json',
            success: function (resp) {
                if (resp.code == 0) {
                    $.each(resp.data, function (index, item) {
                        let opera;
                        if (item.delFlag == '2') {
                            opera = '<span>申请中</span>';
                        } else {
                            opera =
                                "<button onclick='rentAssist(this)' class='layui-btn layui-btn-sm layui-btn-primary'>借调</button>" +
                                // "<button onclick='modifyAssist(this)' class='layui-btn layui-btn-sm layui-btn-primary'>修改</button>" +
                                "<button onclick='outAssist(this)' style='position: relative;left: 3px' class='layui-btn layui-btn-sm layui-btn-danger'>出库</button>";
                        }
                        centerTab.append("              <tr>" +
                            "                                <td>" + item.id + "</td>" +
                            "                                <td>" + item.name + "</td>" +
                            "                                <td>" + item.spec + "</td>" +
                            "                                <td>" + item.username + "</td>" +
                            "                                <td>" + item.unit + "</td>" +
                            "                                <td>" + item.num + "</td>" +
                            "                                <td>" + item.createTime + "</td>" +
                            "                                <td><div id='" + item.id + "' style='display: flex'>" +
                            opera +
                            "                                    </div>" +
                            "                               </td>" +
                            "                            </tr>")
                    });
                } else {
                    layer.msg(resp.msg);
                }
                // refreshPage(count);
            }
        });
    }

/*    function modifyAssist(e) {
        let id = $(e).parent().attr("id");
        window.location.href = "/addAssist?type=modify&id=" + id;
    }*/

    function outAssist(e) {
        let id = $(e).parent().attr("id");
        layer.open({
            type: 0,
            content: "<div>出库数量：<input id='outNum' type='number' />" +
                "</div>",
            btn: ['确认'],
            yes: function () {
                $.ajax({
                    url: '/storeController/outAssist',
                    data: {id: id, outNum: $("#outNum").val()},
                    async: false,
                    type: 'get',
                    contentType: 'application/json',
                    success: function (resp) {
                        layer.msg(resp.msg);
                        setTimeout(() => run(), 1800);

                        async function run() {
                            await setTimeout;
                            window.location.reload();
                        }
                    }
                });
            }
        });

    }

    function rentAssist(e) {
        let id = $(e).parent().attr("id");
        layer.open({
            type: 0,
            content: "<div>借调目标库：<select id='rent'>" +
                "</select></div>",
            btn: ['确认'],
            yes: function () {
                $.ajax({
                    url: '/storeController/rentAssist',
                    data: {assistId: id, kind: $("#rent").val(), username: getQueryVariable("account")},
                    async: false,
                    type: 'get',
                    contentType: 'application/json',
                    success: function (resp) {
                        layer.msg(resp.msg);
                    }

                });
            }
        });
        let rent = $("#rent");
        $.ajax({
            url: '/storeController/loadAssistList',
            data: null,
            async: false,
            type: 'get',
            contentType: 'application/json',
            success: function (resp) {
                if (resp.code == 0) {
                    $.each(resp.data, function (index, item) {
                        rent.append("<option value ='" + item.id + "'>" + item.name + "</option>");
                    });
                }
            }

        });
    }
</script>
</body>
</html>